<template>
  <div class="editmain" v-show="EditShow" >
      <div class="edit-top">
          <span>编辑节点属性</span>
          <i class="el-icon-close" style="line-height:35px;cursor:pointer;" @click="close"></i>
      </div>
      <div class="edit-bottom" >
          <el-form ref="form" :model="fromdata" label-width="80px">
                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.name" size="mini" style="width:400px;" ></el-input>
                </el-form-item>
                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.a" size="mini" style="width:400px;" ></el-input>
                </el-form-item>
                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.b" size="mini" style="width:400px;" ></el-input>
                </el-form-item>
                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.c" size="mini" style="width:400px;" ></el-input>
                </el-form-item>

                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.d" size="mini" style="width:400px;" ></el-input>
                </el-form-item>
                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.e" size="mini" style="width:400px;" ></el-input>
                </el-form-item>
                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.f" size="mini" style="width:400px;" ></el-input>
                </el-form-item>
                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.g" size="mini" style="width:400px;" ></el-input>
                </el-form-item>
                <el-form-item label="活动名称" style="color:#fff!important;" >
                    <el-input v-model="fromdata.h" size="mini" style="width:400px;" ></el-input>
                </el-form-item>
                
           </el-form>

           <el-button type="primary" style="width:100%">保 存</el-button>
      </div>
  </div>
</template>

<script lang='ts'>
import {Component , Vue} from 'vue-property-decorator'
import {mapGetters} from 'vuex'

@Component({
    computed:{
        ...mapGetters(['EditShow'])
    }
})
export default class EditDialog extends Vue {
    private fromdata:any={
        name:'1122',
        a:"1212",
        b:"4645",
        c:"大富大贵",
        d:'sdf',
        e:"1212",
        f:"4645",
        g:"大富大贵",
        h:'sdf'
    }
    private close(){
        this.$store.commit('SET_EDIT_SHOW',false)
    }
}
</script>

<style lang='scss'>
    .editmain{
        width: 535px;
        .edit-top{
            height: 35px;
            color: #fff;
            border: 1px solid #448dcc !important;
            box-shadow: inset 0 0 25px 0 rgba(79, 170, 255, 0.6) !important;
            border-radius: 3px 3px 0 0;
            padding: 0 12px;
            display: flex;
            justify-content: space-between;
            line-height: 35px;;
            font-size: 16px;
        }
        .edit-bottom{
            padding: 20px;;
            border: 1px solid #448dcc !important;
            background: rgba(21, 54, 87, 0.5);
        }
        .el-form-item__label{
            color: #eee;
        }
        .el-form-item{
            margin-bottom: 2px;
        }
        .el-input__inner {
                border: 1px solid #ccc!important;
        }
    }
</style>